import React from 'react';
import NavBar from '../Common/NavBar';
import {Connect} from '../../service/Connect';

import './List.css';

// const List = () => {
    
//     const data = [
//         {
//             name: '小贝',
//             age: 11,
//             sex: 'male'
//         },{
//             name: '小小',
//             age: 22,
//             sex: 'female'
//         }
//     ];

//     const dataDom = [
//         <li key="1">dataDom 1号</li>,
//         <li key="2">dataDom 2号</li>
//     ];
    
//     return (
//         <div>
//             <NavBar title="List页"></NavBar>
//             <ul>
//                 {
//                     data.map((item, index) => (
//                         <li key={index}>
//                             <strong>名字:</strong>
//                             <span>{item.name}</span>
//                             <strong>大小:</strong>
//                             <span>{item.age}</span>
//                             <strong>性别:</strong>
//                             <span>{item.sex}</span>
//                         </li>
//                         )
//                     )
//                 }
//                 {dataDom}
//             </ul>
//         </div>
//     );

// };

const List = (props) => {
    return (
        <div>
            <NavBar title="列表页" />
            <ul className="content list">
                {
                props.data && props.data.length > 0 &&
                props.data.map((item, index) => (
                    <li key={index}>
                    <strong>名称: </strong>
                    <span> { item.name }</span>
                    <time> { item.createTime }</time>
                    </li>
                ))
                }
            </ul>
        </div>
    );
};

export default Connect(List);